/*
 * 
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not
 * use this file except in compliance with the License. You may obtain a copy of
 * the License at
 * 
 * http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
 * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the
 * License for the specific language governing permissions and limitations under
 * the License.
 */
package com.lawal.client.ui;

import java.util.ArrayList;
import java.util.List;

import com.google.gwt.event.dom.client.KeyCodes;
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.Element;
import com.google.gwt.user.client.Event;
import com.google.gwt.user.client.Timer;
import com.google.gwt.user.client.ui.FocusPanel;
import com.vaadin.terminal.gwt.client.ApplicationConnection;
import com.vaadin.terminal.gwt.client.ContainerResizedListener;
import com.vaadin.terminal.gwt.client.Paintable;
import com.vaadin.terminal.gwt.client.UIDL;
import com.vaadin.terminal.gwt.client.VConsole;
import com.vaadin.terminal.gwt.client.ui.Field;

/**
 * A widget that allows the user to select a value within a range of possible
 * values using a sliding bar that responds to mouse events. <h3>Keyboard Events
 * </h3>
 * <p>
 * VSliderBar listens for the following key events. Holding down a key will
 * repeat the action until the key is released.
 * <ul class='css'>
 * <li>left arrow - shift left one step</li>
 * <li>right arrow - shift right one step</li>
 * <li>ctrl+left arrow - jump left 10% of the distance</li>
 * <li>ctrl+right arrow - jump right 10% of the distance</li>
 * <li>home - jump to min value</li>
 * <li>end - jump to max value</li>
 * <li>space - jump to middle value</li>
 * </ul>
 * </p>
 * <h3>CSS Style Rules</h3>
 * <ul class='css'>
 * <li>.gwt-VSliderBar-shell { primary style }</li>
 * <li>.gwt-VSliderBar-shell-focused { primary style when focused }</li>
 * <li>.gwt-VSliderBar-shell gwt-VSliderBar-line { the line that the knob moves
 * along }</li>
 * <li>.gwt-VSliderBar-shell gwt-VSliderBar-line-sliding { the line that the
 * knob moves along when sliding }</li>
 * <li>.gwt-VSliderBar-shell .gwt-VSliderBar-knob { the sliding knob }</li>
 * <li>.gwt-VSliderBar-shell .gwt-VSliderBar-knob-sliding { the sliding knob
 * when sliding }</li>
 * <li>.gwt-VSliderBar-shell .gwt-VSliderBar-tick { the ticks along the line }</li>
 * <li>.gwt-VSliderBar-shell .gwt-VSliderBar-label { the text labels along the
 * line }</li>
 * </ul>
 */
public class VSliderBar extends FocusPanel implements Paintable, Field, ContainerResizedListener {
	private static final String VALUE_VARIABLE = "value";
	private static final String CLASSNAME = "gwt-VSliderBar-shell";
	/**
	 * The current value.
	 */
	private double curValue;
	/**
	 * The timer used to continue to shift the knob if the user holds down a
	 * key.
	 */
	private KeyTimer keyTimer = new KeyTimer();
	/**
	 * The elements used to display labels above the ticks.
	 */
	private List<Element> labelElements = new ArrayList<Element>();
	/**
	 * The line that the knob moves over.
	 */
	private Element lineElement;
	/**
	 * The offset between the edge of the shell and the line.
	 */
	private int lineLeftOffset = 0;
	/**
	 * The maximum slider value.
	 */
	private double maxValue;
	/**
	 * The minimum slider value.
	 */
	private double minValue;
	/**
	 * The number of labels to show.
	 */
	private int numLabels = 0;
	/**
	 * The number of tick marks to show.
	 */
	private int numTicks = 0;
	/**
	 * A bit indicating whether or not we are currently sliding the slider bar
	 * due to keyboard events.
	 */
	private boolean slidingKeyboard = false;
	/**
	 * A bit indicating whether or not we are currently sliding the slider bar
	 * due to mouse events.
	 */
	private boolean slidingMouse = false;
	/**
	 * A bit indicating whether or not the slider is enabled
	 */
	private boolean enabled = true;
	/**
	 * The size of the increments between knob positions.
	 */
	private double stepSize;
	/**
	 * The elements used to display tick marks, which are the vertical lines
	 * along the slider bar.
	 */
	private List<Element> tickElements = new ArrayList<Element>();
	private LabelFormatter labelFormatter;
	private Element knobElement;
	private ApplicationConnection client;
	private String id;
	private boolean immediate;
	private boolean readonly;
	private Element progressElement;
	private boolean superImmediate = false;
	private String dateformat;

	public VSliderBar() {
		super();
		VConsole.log(" VSliderBar()");
		this.minValue = 0;
		this.maxValue = 100;
		this.curValue = 0;
		this.stepSize = 10;
		setLabelFormatter(LabelFormatter.getDefault());
		// Create the outer shell
		DOM.setStyleAttribute(getElement(), "position", "relative");
		setStyleName(CLASSNAME);
		// Create the line
		lineElement = DOM.createDiv();
		DOM.appendChild(getElement(), lineElement);
		DOM.setStyleAttribute(lineElement, "position", "absolute");
		DOM.setElementProperty(lineElement, "className", "gwt-VSliderBar-line");
		// Create the knob
		// images.slider().applyTo(knobImage);
		// Element knobElement = knobImage.getElement();
		knobElement = DOM.createDiv();
		DOM.appendChild(getElement(), knobElement);
		DOM.setStyleAttribute(knobElement, "position", "absolute");
		DOM.setElementProperty(knobElement, "className", "gwt-VSliderBar-knob");
		progressElement = DOM.createDiv();
		DOM.appendChild(getElement(), progressElement);
		DOM.setStyleAttribute(progressElement, "position", "absolute");
		DOM.setElementProperty(progressElement, "className", "gwt-VSliderBar-progress");
		sinkEvents(Event.MOUSEEVENTS | Event.ONMOUSEWHEEL | Event.KEYEVENTS | Event.FOCUSEVENTS | Event.TOUCHEVENTS);
	}

	/**
	 * Return the total range between the minimum and maximum values.
	 * 
	 * @return the total range
	 */
	public double getTotalRange() {
		if (minValue > maxValue) {
			return 0;
		}
		return maxValue - minValue;
	}

	/**
	 * Listen for events that will move the knob.
	 * 
	 * @param event
	 *            the event that occurred
	 */
	@Override
	public void onBrowserEvent(Event event) {
		super.onBrowserEvent(event);
		// VConsole.log("browser event" + DOM.eventGetType(event));
		if (!enabled || readonly) {
			return;
		}
		switch (DOM.eventGetType(event)) {
		// Unhighlight and cancel keyboard events
		case Event.ONBLUR:
			keyTimer.cancel();
			if (slidingMouse) {
				DOM.releaseCapture(getElement());
				slidingMouse = false;
				slideKnob(event);
				stopSliding(true, true);
			} else if (slidingKeyboard) {
				slidingKeyboard = false;
				stopSliding(true, true);
			}
			unhighlight();
			break;
		// Highlight on focus
		case Event.ONFOCUS:
			highlight();
			break;
		// Mousewheel events
		case Event.ONMOUSEWHEEL:
			int velocityY = DOM.eventGetMouseWheelVelocityY(event);
			DOM.eventPreventDefault(event);
			if (velocityY < 0) {
				shiftRight(1,true);
			} else {
				shiftLeft(1,true);
			}
			break;
		// Shift left or right on key press
		case Event.ONKEYDOWN:
			processKeyDown(event);
			break;
		// Stop shifting on key up
		case Event.ONKEYUP:
			keyTimer.cancel();
			if (slidingKeyboard) {
				slidingKeyboard = false;
				stopSliding(true, true);
			}
			break;
		// Mouse Events
		case Event.ONMOUSEDOWN:
		case Event.ONTOUCHSTART:
			setFocus(true);
			slidingMouse = true;
			DOM.setCapture(getElement());
			startSliding(true, true);
			DOM.eventPreventDefault(event);
			slideKnob(event);
			break;
		case Event.ONMOUSEUP:
			// case Event.ONTOUCHEND:
			if (slidingMouse) {
				DOM.releaseCapture(getElement());
				slidingMouse = false;
				slideKnob(event);
				stopSliding(true, true);
			}
			break;
		case Event.ONMOUSEMOVE:
		case Event.ONTOUCHMOVE:
			if (slidingMouse) {
				slideKnob(event);
			}
			break;
		}
		VConsole.log("sldMouse " + slidingMouse + " slidKey" + slidingKeyboard + " stepSZ" + stepSize);
	}

	private void processKeyDown(Event event) {
		if (slidingKeyboard) {
			return;
		}
		int multiplier = 1;
		if (DOM.eventGetCtrlKey(event)) {
			multiplier = (int) (getTotalRange() / stepSize / 10);
		}
		switch (DOM.eventGetKeyCode(event)) {
		case KeyCodes.KEY_HOME:
			DOM.eventPreventDefault(event);
			setCurrentValue(minValue,true);
			break;
		case KeyCodes.KEY_END:
			DOM.eventPreventDefault(event);
			setCurrentValue(maxValue,true);
			break;
		case KeyCodes.KEY_LEFT:
			DOM.eventPreventDefault(event);
			slidingKeyboard = true;
			startSliding(false, true);
			shiftLeft(multiplier,superImmediate);
			keyTimer.schedule(400, false, multiplier);
			break;
		case KeyCodes.KEY_RIGHT:
			DOM.eventPreventDefault(event);
			slidingKeyboard = true;
			startSliding(false, true);
			shiftRight(multiplier,superImmediate);
			keyTimer.schedule(400, true, multiplier);
			break;
		case 32:
			DOM.eventPreventDefault(event);
			setCurrentValue(minValue + getTotalRange() / 2,true);
			break;
		}
	}

	/**
	 * This method is called when the dimensions of the parent element change.
	 * Subclasses should override this method as needed.
	 * 
	 * @param width
	 *            the new client width of the element
	 * @param height
	 *            the new client height of the element
	 */
	public void onResize(int width, int height) {
		// Center the line in the shell
		int lineWidth = DOM.getElementPropertyInt(lineElement, "offsetWidth");
		lineLeftOffset = (width / 2) - (lineWidth / 2);
		DOM.setStyleAttribute(lineElement, "left", lineLeftOffset + "px");
		// Draw the other components
		drawLabels();
		drawTicks();
		drawKnobAndProgress();
	}

	/**
	 * Redraw the progress bar when something changes the layout.
	 */
	public void redraw() {
		if (isAttached()) {
			int width = DOM.getElementPropertyInt(getElement(), "clientWidth");
			int height = DOM.getElementPropertyInt(getElement(), "clientHeight");
			onResize(width, height);
		}
	}

//	/**
//	 * Set the current value and fire the onValueChange event.
//	 * 
//	 * @param curValue
//	 *            the current value
//	 */
//	public void setCurrentValue(double curValue) {
//		setCurrentValue(curValue, true);
//	}

	/**
	 * Set the current value and optionally fire the onValueChange event.
	 * 
	 * @param curValue
	 *            the current value
	 * @param fireEvent
	 *            fire the onValue change event if true
	 */
	public void setCurrentValue(double curValue, boolean fireEvent) {
		// Confine the value to the range
		this.curValue = Math.max(minValue, Math.min(maxValue, curValue));
		double remainder = (this.curValue - minValue) % stepSize;
		this.curValue -= remainder;
		// Go to next step if more than halfway there
		if ((remainder > (stepSize / 2)) && ((this.curValue + stepSize) <= maxValue)) {
			this.curValue += stepSize;
		}
		// Redraw the knob and progress bar
		drawKnobAndProgress();
		if (fireEvent) {
			updateValueToServer();
		}
		VConsole.log(" setCurrentValue" + curValue + " "+superImmediate);
	}

	private void updateValueToServer() {
		client.updateVariable(id, VALUE_VARIABLE, getCurrentValue(), immediate);
	}

	/**
	 * Sets whether this widget is enabled.
	 * 
	 * @param enabled
	 *            true to enable the widget, false to disable it
	 */
	public void setEnabled(boolean enabled) {
		this.enabled = enabled;
		if (enabled) {
			// images.slider().applyTo(knobImage);
			DOM.setElementProperty(lineElement, "className", "gwt-VSliderBar-line");
		} else {
			// images.sliderDisabled().applyTo(knobImage);
			DOM.setElementProperty(lineElement, "className", "gwt-VSliderBar-line gwt-VSliderBar-line-disabled");
		}
		redraw();
	}

	/**
	 * Set the label formatter.
	 * 
	 * @param labelFormatter
	 *            the label formatter
	 */
	public void setLabelFormatter(LabelFormatter labelFormatter) {
		this.labelFormatter = labelFormatter;
	}

	/**
	 * Set the max value.
	 * 
	 * @param maxValue
	 *            the current value
	 */
	public void setMaxValue(double maxValue) {
		this.maxValue = maxValue;
		drawLabels();
		resetCurrentValue();
	}

	/**
	 * Set the minimum value.
	 * 
	 * @param minValue
	 *            the current value
	 */
	public void setMinValue(double minValue) {
		this.minValue = minValue;
		drawLabels();
		resetCurrentValue();
	}

	/**
	 * Set the number of labels to show on the line. Labels indicate the value
	 * of the slider at that point. Use this method to enable labels. If you set
	 * the
	 * number of labels equal to the total range divided by the step size, you
	 * will get a properly aligned "jumping" effect where the knob jumps between
	 * labels.
	 * Note that the number of labels displayed will be one more than the number
	 * you specify, so specify 1 labels to show labels on either end of the
	 * line. In
	 * other words, numLabels is really the number of slots between the labels.
	 * setNumLabels(0) will disable labels.
	 * 
	 * @param numLabels
	 *            the number of labels to show
	 */
	public void setNumLabels(int numLabels) {
		this.numLabels = numLabels;
		drawLabels();
	}

	/**
	 * Set the number of ticks to show on the line. A tick is a vertical line
	 * that represents a division of the overall line. Use this method to enable
	 * ticks.
	 * If you set the number of ticks equal to the total range divided by the
	 * step size, you will get a properly aligned "jumping" effect where the
	 * knob jumps
	 * between ticks. Note that the number of ticks displayed will be one more
	 * than the number you specify, so specify 1 tick to show ticks on either
	 * end of the
	 * line. In other words, numTicks is really the number of slots between the
	 * ticks. setNumTicks(0) will disable ticks.
	 * 
	 * @param numTicks
	 *            the number of ticks to show
	 */
	public void setNumTicks(int numTicks) {
		this.numTicks = numTicks;
		drawTicks();
	}

	/**
	 * Set the step size.
	 * 
	 * @param stepSize
	 *            the current value
	 */
	public void setStepSize(double stepSize) {
		if (Double.compare(0.0, stepSize) >= 0) {
			this.stepSize = 0.5;
		} else {
			this.stepSize = stepSize;
		}
		resetCurrentValue();
	}

	/**
	 * Shift to the left (smaller value).
	 * 
	 * @param numSteps
	 *            the number of steps to shift
	 */
	public void shiftLeft(int numSteps, boolean updateToserver) {
		setCurrentValue(getCurrentValue() - numSteps * stepSize, updateToserver);
	}

	/**
	 * Shift to the right (greater value).
	 * 
	 * @param numSteps
	 *            the number of steps to shift
	 */
	public void shiftRight(int numSteps, boolean updateToserver) {
		setCurrentValue(getCurrentValue() + numSteps * stepSize,  updateToserver);
	}

	/**
	 * Format the label to display above the ticks Override this method in a
	 * subclass to customize the format. By default, this method returns the
	 * integer
	 * portion of the value.
	 * 
	 * @param value
	 *            the value at the label
	 * @return the text to put in the label
	 */
	protected String formatLabel(double value) {
		if (labelFormatter != null) {
			return labelFormatter.formatLabel(this, value);
		}
		return (int) (10 * value) / 10.0 + "";
	}

	/**
	 * Get the percentage of the knob's position relative to the size of the
	 * line. The return value will be between 0.0 and 1.0.
	 * 
	 * @return the current percent complete
	 */
	protected double getKnobPercent() {
		// If we have no range
		if (maxValue <= minValue) {
			return 0;
		}
		// Calculate the relative progress
		double percent = (curValue - minValue) / (maxValue - minValue);
		return Math.max(0.0, Math.min(1.0, percent));
	}

	/**
	 * This method is called immediately after a widget becomes attached to the
	 * browser's document.
	 */
	@Override
	protected void onLoad() {
		// Reset the position attribute of the parent element
		DOM.setStyleAttribute(getElement(), "position", "relative");
		// ResizableWidgetCollection.get().add(this);
		redraw();
	}

	/**
	 * Draw the knob where it is supposed to be relative to the line.
	 */
	private void drawKnobAndProgress() {
		// Abort if not attached
		if (!isAttached()) {
			return;
		}
		// // Move the knob to the correct position
		// Element knobElement = knobImage.getElement();
		int lineWidth = DOM.getElementPropertyInt(lineElement, "offsetWidth");
		int knobWidth = DOM.getElementPropertyInt(knobElement, "offsetWidth");
		int knobLeftOffset = (int) (lineLeftOffset + (getKnobPercent() * lineWidth) - (knobWidth / 2));
		knobLeftOffset = Math.min(knobLeftOffset, lineLeftOffset + lineWidth - (knobWidth / 2) - 1);
		DOM.setStyleAttribute(knobElement, "left", knobLeftOffset + "px");
		DOM.setStyleAttribute(progressElement, "left", lineLeftOffset + "px");
		DOM.setStyleAttribute(progressElement, "width", 95 * getKnobPercent() + "%");
	}

	/**
	 * Draw the labels along the line.
	 */
	private void drawLabels() {
		// Abort if not attached
		if (!isAttached()) {
			return;
		}
		// Draw the labels
		int lineWidth = DOM.getElementPropertyInt(lineElement, "offsetWidth");
		if (numLabels > 0) {
			// Create the labels or make them visible
			for (int i = 0; i <= numLabels; i++) {
				Element label = null;
				if (i < labelElements.size()) {
					label = labelElements.get(i);
				} else { // Create the new label
					label = DOM.createDiv();
					DOM.setStyleAttribute(label, "position", "absolute");
					DOM.setStyleAttribute(label, "display", "none");
					if (enabled) {
						DOM.setElementProperty(label, "className", "gwt-VSliderBar-label");
					} else {
						DOM.setElementProperty(label, "className", "gwt-VSliderBar-label-disabled");
					}
					DOM.appendChild(getElement(), label);
					labelElements.add(label);
				}
				// Set the label text
				double value = minValue + (getTotalRange() * i / numLabels);
				DOM.setStyleAttribute(label, "visibility", "hidden");
				DOM.setStyleAttribute(label, "display", "");
				DOM.setElementProperty(label, "innerHTML", formatLabel(value));
				// Move to the left so the label width is not clipped by the
				// shell
				DOM.setStyleAttribute(label, "left", "0px");
				// Position the label and make it visible
				int labelWidth = DOM.getElementPropertyInt(label, "offsetWidth");
				int labelLeftOffset = lineLeftOffset + (lineWidth * i / numLabels) - (labelWidth / 2);
				labelLeftOffset = Math.min(labelLeftOffset, lineLeftOffset + lineWidth - labelWidth);
				labelLeftOffset = Math.max(labelLeftOffset, lineLeftOffset);
				DOM.setStyleAttribute(label, "left", labelLeftOffset + "px");
				DOM.setStyleAttribute(label, "visibility", "visible");
			}
			// Hide unused labels
			for (int i = (numLabels + 1); i < labelElements.size(); i++) {
				DOM.setStyleAttribute(labelElements.get(i), "display", "none");
			}
		} else { // Hide all labels
			for (Element elem : labelElements) {
				DOM.setStyleAttribute(elem, "display", "none");
			}
		}
	}

	/**
	 * Draw the tick along the line.
	 */
	private void drawTicks() {
		// Abort if not attached
		if (!isAttached()) {
			return;
		}
		// Draw the ticks
		int lineWidth = DOM.getElementPropertyInt(lineElement, "offsetWidth");
		if (numTicks > 0) {
			// Create the ticks or make them visible
			for (int i = 0; i <= numTicks; i++) {
				Element tick = null;
				if (i < tickElements.size()) {
					tick = tickElements.get(i);
				} else {
					// Create the new tick
					tick = DOM.createDiv();
					DOM.setStyleAttribute(tick, "position", "absolute");
					DOM.setStyleAttribute(tick, "display", "none");
					DOM.appendChild(getElement(), tick);
					tickElements.add(tick);
				}
				if (enabled) {
					DOM.setElementProperty(tick, "className", "gwt-VSliderBar-tick");
				} else {
					DOM.setElementProperty(tick, "className", "gwt-VSliderBar-tick gwt-VSliderBar-tick-disabled");
				}
				// Position the tick and make it visible
				DOM.setStyleAttribute(tick, "visibility", "hidden");
				DOM.setStyleAttribute(tick, "display", "");
				int tickWidth = DOM.getElementPropertyInt(tick, "offsetWidth");
				int tickLeftOffset = lineLeftOffset + (lineWidth * i / numTicks) - (tickWidth / 2);
				tickLeftOffset = Math.min(tickLeftOffset, lineLeftOffset + lineWidth - tickWidth);
				DOM.setStyleAttribute(tick, "left", tickLeftOffset + "px");
				DOM.setStyleAttribute(tick, "visibility", "visible");
			}
			// Hide unused ticks
			for (int i = (numTicks + 1); i < tickElements.size(); i++) {
				DOM.setStyleAttribute(tickElements.get(i), "display", "none");
			}
		} else { // Hide all ticks
			for (Element elem : tickElements) {
				DOM.setStyleAttribute(elem, "display", "none");
			}
		}
	}

	/**
	 * Highlight this widget.
	 */
	private void highlight() {
		String styleName = getStylePrimaryName();
		DOM.setElementProperty(getElement(), "className", styleName + " " + styleName + "-focused");
	}

	/**
	 * Reset the progress to constrain the progress to the current range and
	 * redraw the knob as needed.
	 */
	private void resetCurrentValue() {
		setCurrentValue(getCurrentValue(),true);
	}

	/**
	 * Slide the knob to a new location.
	 * 
	 * @param event
	 *            the mouse event
	 */
	private void slideKnob(Event event) {
		int x = DOM.eventGetClientX(event);
		if (x > 0) {
			int lineWidth = DOM.getElementPropertyInt(lineElement, "offsetWidth");
			int lineLeft = DOM.getAbsoluteLeft(lineElement);
			double percent = (double) (x - lineLeft) / lineWidth * 1.0;
			setCurrentValue(getTotalRange() * percent + minValue, superImmediate);
		}
	}

	/**
	 * Start sliding the knob.
	 * 
	 * @param highlight
	 *            true to change the style
	 * @param fireEvent
	 *            true to fire the event
	 */
	private void startSliding(boolean highlight, boolean fireEvent) {
		if (highlight) {
			DOM.setElementProperty(lineElement, "className", "gwt-VSliderBar-line gwt-VSliderBar-line-sliding");
			DOM.setElementProperty(knobElement, "className", "gwt-VSliderBar-knob gwt-VSliderBar-knob-sliding");
		}
	}

	/**
	 * Stop sliding the knob.
	 * 
	 * @param unhighlight
	 *            true to change the style
	 * @param fireEvent
	 *            true to fire the event
	 */
	private void stopSliding(boolean unhighlight, boolean fireEvent) {
		if (unhighlight) {
			DOM.setElementProperty(lineElement, "className", "gwt-VSliderBar-line");
			DOM.setElementProperty(knobElement, "className", "gwt-VSliderBar-knob-inactive");
		}
		
		if (fireEvent) {
			updateValueToServer();
		}
		
	}

	/**
	 * Unhighlight this widget.
	 */
	private void unhighlight() {
		DOM.setElementProperty(getElement(), "className", getStylePrimaryName());
	}

	@Override
	public void updateFromUIDL(UIDL uidl, ApplicationConnection connClient) {
		this.client = connClient;
		id = uidl.getId();
		// Ensure correct implementation
		if (connClient.updateComponent(this, uidl, true)) {
			return;
		}
		superImmediate = uidl.getBooleanAttribute("superimmediate");
		immediate = uidl.getBooleanAttribute("immediate");
		readonly = uidl.getBooleanAttribute("readonly");
		String format = uidl.getStringAttribute("dateformat");
		if(format!=null) {
			setLabelFormatter(LabelFormatter.getDateLabelFormatter(format));
		}
		boolean disables = uidl.getBooleanAttribute("disabled");
		double value = uidl.getDoubleVariable(VALUE_VARIABLE);
		double min = uidl.getDoubleAttribute("min");
		double max = uidl.getDoubleAttribute("max");
		int ticks = uidl.getIntAttribute("numticks");
		int numLabel = uidl.getIntAttribute("numlabels");
		double resolution = uidl.getDoubleAttribute("stepsize");
		this.stepSize = (resolution);
		this.minValue = (min);
		this.maxValue = (max);
		setEnabled(!disables);
		setNumLabels(numLabel);
		setNumTicks(ticks);
		setCurrentValue(value, false);
		VConsole.log("value " + value + " min " + min + " max " + max);
	}

	@Override
	public void iLayout() {
		// Update handle position
		setCurrentValue(curValue, false);
	}

	// GETTERS
	/**
	 * Return the current value.
	 * 
	 * @return the current value
	 */
	public double getCurrentValue() {
		return curValue;
	}

	/**
	 * Return the label formatter.
	 * 
	 * @return the label formatter
	 */
	public LabelFormatter getLabelFormatter() {
		return labelFormatter;
	}

	/**
	 * Return the max value.
	 * 
	 * @return the max value
	 */
	public double getMaxValue() {
		return maxValue;
	}

	/**
	 * Return the minimum value.
	 * 
	 * @return the minimum value
	 */
	public double getMinValue() {
		return minValue;
	}

	/**
	 * Return the number of labels.
	 * 
	 * @return the number of labels
	 */
	public int getNumLabels() {
		return numLabels;
	}

	/**
	 * Return the number of ticks.
	 * 
	 * @return the number of ticks
	 */
	public int getNumTicks() {
		return numTicks;
	}

	/**
	 * Return the step size.
	 * 
	 * @return the step size
	 */
	public double getStepSize() {
		return stepSize;
	}

	/**
	 * @return Gets whether this widget is enabled
	 */
	public boolean isEnabled() {
		return enabled;
	}

	/**
	 * The timer used to continue to shift the knob as the user holds down one
	 * of the left/right arrow keys. Only IE auto-repeats, so we just keep
	 * catching the
	 * events.
	 */
	private class KeyTimer extends Timer {
		/**
		 * A bit indicating that this is the first run.
		 */
		private boolean firstRun = true;
		/**
		 * The delay between shifts, which shortens as the user holds down the
		 * button.
		 */
		private int repeatDelay = 30;
		/**
		 * A bit indicating whether we are shifting to a higher or lower value.
		 */
		private boolean shiftRight = false;
		/**
		 * The number of steps to shift with each press.
		 */
		private int multiplier = 1;

		/**
		 * This method will be called when a timer fires. Override it to
		 * implement the timer's logic.
		 */
		@Override
		public void run() {
			// Highlight the knob on first run
			if (firstRun) {
				firstRun = false;
				startSliding(true, false);
			}
			// Slide the slider bar
			if (shiftRight) {
				setCurrentValue(curValue + multiplier * stepSize, superImmediate);
			} else {
				setCurrentValue(curValue - multiplier * stepSize,superImmediate);
			}
			// Repeat this timer until cancelled by keyup event
			schedule(repeatDelay);
		}

		/**
		 * Schedules a timer to elapse in the future.
		 * 
		 * @param delayMillis
		 *            how long to wait before the timer elapses, in milliseconds
		 * @param shiftRight
		 *            whether to shift up or not
		 * @param multiplier
		 *            the number of steps to shift
		 */
		public void schedule(int delayMillis, boolean shiftRight, int multiplier) {
			firstRun = true;
			this.shiftRight = shiftRight;
			this.multiplier = multiplier;
			super.schedule(delayMillis);
		}
	}
}